<template>
	<!-- 任务 -->
	<view class="">
		<view class="task-item" @click.stop="toTaskDetail">
			<view class="acea-row row-top row-between item-top">
				<view class="task-tit line2">出租 | 汽车西站-五一广场-地下商业街| 2000㎡ | 20000元/㎡</view>
				<view class="task-tit-l">
					<view class="task-top-btn">领任务</view>
					<view>（已133人领）</view>
				</view>
			</view>
			<view class="acea-row row-bottom row-between item-bottom">
				<view class="share-list">
					<view class="share-item">
						分享赚1: <text>现金1000元</text>	（已托管平台）
					</view>
					<view class="share-item">
						分享赚2: <text>价值1888元(金币)</text>,剩余184(金币)
					</view>
				</view>
				<view class="item-bottom-btn">任务详情</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			list:{
				type:Array,
				default:()=>{
					return [1,1,1]
				}
			},canClose:{
				type:Boolean,
				default:()=>{
					return false
				}
			},
			detail:{
				type:Object,
				default:()=>{
					return {}
				}
			}
		},
		data(){
			return{
				
			}
		},
		methods:{
			toTaskDetail(){
				uni.navigateTo({
					url:'/pages/details/offeraRreward/offeraRreward'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.task-list{
		background: #ffffff;
		border-radius: 10rpx 10rpx 0 0;
		margin: 0 26rpx 26rpx;
		padding: 36rpx;
	}
	.task-more-btn{
		margin: 24rpx auto;
		width: 222rpx;
		height: 52rpx;
		opacity: 1;
		border-radius: 30rpx;
		border: 1px solid rgba(238, 33, 45, 1);    
		font-size: 26rpx;
		font-weight: 400;
		line-height: 52rpx;
		color: rgba(238, 33, 45, 1);
		text-align: center;
	}
	.task-top-btn{
		width: 154rpx;
		height: 46rpx;
		line-height: 46rpx;
		text-align: center;
		border-radius: 30rpx;
		border: 1px solid rgba(238, 33, 45, 1); 
		font-size: 28rpx;
		font-weight: 400;
		color: rgba(238, 33, 45, 1);
	}
	
	.task-item{
		padding: 16rpx 22rpx;
		height: 218rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 2rpx 4rpx 8rpx 10rpx rgba(0, 0, 0, 0.03);
		margin-top: 28rpx;
		
		.item-top{
			.task-tit{
				width: 65%;
			}
			.task-tit-l{
				// width: 30%;
				font-size: 24rpx;
				font-weight: 400;
				color: rgba(166, 166, 166, 1);
				text-align: center;
				.task-top-btn{
					width: 132rpx;
					height: 42rpx;
					margin: 0 auto 6rpx;
					line-height: 42rpx;
					text-align: center;
					border-radius: 50rpx;
					background: rgba(238, 33, 45, 1);
					border: 1px solid rgba(235, 36, 61, 1);
					color: #ffffff;
				}
			}
		}
		
		.item-bottom{
			.share-list{
				width: 75%;
				.share-item{
					/** 文本1 */
					font-size: 24rpx;
					font-weight: 400;
					color: rgba(166, 166, 166, 1);
					margin-top: 12rpx;
					text{
						/** 文本2 */
						font-size: 24rpx;
						font-weight: 400;
						color: rgba(212, 48, 48, 1);
					}
				}
			}
			.item-bottom-btn{
				font-size: 24rpx;
				font-weight: 400;
				color: rgba(238, 33, 45, 1);
				&::after{
					content: '';
					display: block;
					position: absolute;
					top: 50%;
					right: 0;
					margin-top: -5rpx;
					width: 10rpx;
					height: 10rpx;
					border-top: 1px solid rgba(238, 33, 45, 1);
					border-right: 1px solid rgba(238, 33, 45, 1);
					transform: rotate(45deg);
				}
			}
		}
	}
</style>